﻿<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta content="骡窝窝商城" http-equiv="keywords">
    <meta name="description" content="骡窝窝商城">
    <meta name="viewport" content="width=device-width,user-scalable=no, initial-scale=1">
    <title>骡窝窝商城</title>
    <link rel="stylesheet" href="css/index.css" type="text/css">
    <link rel="stylesheet" href="css/swiper.min.css" type="text/css">
    <link rel="stylesheet" href="css/zy.css" type="text/css">
    <script type="text/javascript" src="js/swiper.min.js"></script>
    <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
    <script src="/js/jquery/jquery.min.js"></script>
    <script src="/js/plugins/jrender/jrender.min.js"></script>

    <script>
        $(function () {
           var user= JSON.parse(sessionStorage.getItem("user"));
            console.log(user);
            $.get("/products", {state: 1, pageSize: 3}, function (data) {
                console.log(data);
                $(".swiper_container_1").renderValues(data, {
                    getHref: function (item, value) {
                        var href = $(item).data("href");
                        $(item).prop("href", href + value);
                        if (value) {
                            var json = JSON.parse(value);
                            console.log(json);
                            $(item).prop("href", "/shopping/productHomePage.html?id=" + json.id + "&sortId=" + json.sortId);
                        }
                    },
                    getSrc: function (item, value) {
                        $(item).attr("src", value[0]);
                    }
                });
                var swiper = new Swiper('.swiper_container_1', {
                    //分页器 自动切换
                    pagination: '.swiper_pagination_1',
                    paginationClickable: true,
                    autoplay: 3500

                });
            })
            $.get("/products",  function (data) {
                console.log(data);
                $("#product").renderValues(data, {
                    getJsonHref: function (item, value) {
                        if (value) {
                            var json = JSON.parse(value);
                            console.log(json);
                            $(item).prop("href", "/shopping/productHomePage.html?id=" + json.id + "&sortId=" + json.sortId);
                        }
                    },
                    getImg: function (item, value) {
                        $(item).attr("src", value[0]);
                    }
                })
            })

            //购物车按钮
            $("#GouWuChe").click(function () {
                var href=$(this).data("href");
                $(this).attr("href",href+user.id);
            })




        })
    </script>
</head>
<body class="shouye">
<!--大小限制-->
<div class="da_xiao_xianz">
    <!--页面内容-->
    <div id="yemnr">
        <!--头部-->
        <div class="toub_beij toub_beij_shouye">
            <div class="zhongj_k">
                <div class="logo_k"><a href="/index.html"><img src="images/web/logo.jpg"></a></div>
                <div class="shous_k"><span></span>
                    <input id="sos_tanc" type="search" input_key=""
                           placeholder="限时疯抢，好物低至1元" placeholder_str=""
                           data-href="/shopping/productList.html?keyword=">
                </div>
                <div class="dengl">
                    <a href="#"><!--跳转到登录-->
                        <div class="caid_img"><img src="images/web/cd.png"></div>
                    </a>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            //滑动头部透明（针对首页头部用）
            window.onscroll = function () {
                var autoheight = document.body.scrollTop || document.documentElement.scrollTop;
                if (autoheight > 10) {
                    $(".toub_beij").css("position", "fixed")
                } else {
                    $(".toub_beij").css("position", "relative")
                }
            }
        </script>
        <!--banner-->
        <div class="swiper_container_1">
            <div class="swiper-wrapper" render-loop="list">
                <div class="swiper-slide">
                    <a data-href="" render-key="list.json" render-fun="getHref">
                        <img render-key="list.imgArr" render-fun="getSrc">
                    </a>
                </div>
            </div>
            <!-- Add Pagination -->
            <div class="swiper_pagination_1"></div>
        </div>

        <!--导航-->
        <div class="neir_beij">
            <ul>
                <li><a href="/shopping/productList.html?id=1">
                    <div class="daohangk"><img src="https://pics.lvjs.com.cn/pics/super/2018/06/1530002974_39326.png">
                    </div>
                    <p>旅行箱包</p></a></li>
                <li><a href="/shopping/productList.html?id=2">
                    <div class="daohangk"><img src="https://pics.lvjs.com.cn/pics/super/2018/06/1530003014_61964.png">
                    </div>
                    <p>美妆洗护</p></a></li>
                <li><a href="/shopping/productList.html?id=3">
                    <div class="daohangk"><img src="https://pics.lvjs.com.cn/pics/super/2018/06/1530002990_93823.png">
                    </div>
                    <p>便携家纺</p></a></li>
                <li><a href="/shopping/productList.html?id=4">
                    <div class="daohangk"><img src="https://pics.lvjs.com.cn/pics/super/2018/06/1530003053_68524.png">
                    </div>
                    <p>潮流数码</p></a></li>
                <li><a href="/shopping/productList.html?id=5">
                    <div class="daohangk"><img src="https://pics.lvjs.com.cn/pics/super/2018/06/1530003360_64433.png">
                    </div>
                    <p>旅行收纳</p></a></li>
                <li><a href="/shopping/productList.html?id=6">
                    <div class="daohangk"><img src="https://pics.lvjs.com.cn/pics/super/2018/06/1530003230_76039.png">
                    </div>
                    <p>优智电器</p></a></li>
                <li><a href="/shopping/productList.html?id=7">
                    <div class="daohangk"><img src="https://pics.lvjs.com.cn/pics/super/2018/06/1530003193_29879.png">
                    </div>
                    <p>健康户外</p></a></li>
                <li><a href="/shopping/productList.html?id=8">
                    <div class="daohangk"><img src="https://pics.lvjs.com.cn/pics/super/2018/06/1530002851_13234.png">
                    </div>
                    <p>查看全部</p></a></li>
            </ul>
        </div>


        <!--切换城市-->
        <div class="qieh_chengs">
            <div class="qieh_zhonj_kuang">
                <p>贵阳市 <span><a href="XuanZeChengShi.html">[切换城市]</a></span><em>丨</em><span
                        class="fenh">打造特色本地购物商城</span></p>
            </div>
        </div>

        <!--广告-->
        <div class="swiper_container_3 ">
            <div class="swiper-wrapper">
                <div class="swiper-slide"><a href="#"><img src="images/web/xia_banner1.jpg"></a></div>
                <div class="swiper-slide"><a href="#"><img src="images/web/xia_banner2.jpg"></a></div>
                <div class="swiper-slide"><a href="#"><img src="images/web/xia_banner1.jpg"></a></div>
            </div>
            <!-- Add Pagination -->
            <div class="swiper_pagination_3"></div>
        </div>
        <script>
            var swiper = new Swiper('.swiper_container_3', {
                pagination: '.swiper_pagination_3',
                paginationClickable: true,
                autoplay: 2000,
            });
        </script>

        <!--热门商品-->
        <div class="rem_shangp_bt_b">
            <div class="waik">
                <em></em>
                <div class="mingz"><i></i>
                    <p class="px26">热门商品</p></div>
                <em></em>
            </div>
        </div>
        <div class="shangp_lieb_beij">
            <ul class="shangp_lieb_k" id="product">
                <div render-loop="list">
                    <li>
                        <a class="aui-list-product-fl-item" render-key="list.json" render-fun="getJsonHref">
                            <div class="lieb_img">
                                <img render-key="list.imgArr" render-fun="getImg">
                            </div>
                            <div class="lieb_txt">
                                <p class="biao" render-html="list.title"></p>
                                <span>¥</span><span class="px26" render-html="list.price"></span>
                                <p class="bend"><em></em>已有评价<i>100+</i> 人</p>
                            </div>
                        </a>
                    </li>
                </div>
            </ul>
        </div>

        <!--底部-->
        <div class="dib_bj">
            <div class="diyi">
                <ul>
                    <li><a href="#">登录</a></li>
                    <p>丨</p>
                    <li><a href="#">注册</a></li>
                    <p>丨</p>
                    <li><a href="#">反馈</a></li>
                    <p>丨</p>
                    <li><a href="#">返回顶部</a></li>
                </ul>
            </div>
            <div class="liange_bb">
                <div class="bb">
                    <a href="#">
                        <div class="bb_img"><img src="images/web/chupb.png"></div>
                        <p>触屏版</p>
                    </a>
                </div>
                <div class="bb">
                    <a href="#">
                        <div class="bb_img"><img src="images/web/diannb.png"></div>
                        <p class="diann_color">电脑版</p>
                    </a>
                </div>
            </div>
            <div class="gs_beian">
                <p>京公网安备：11010602030054号</p>
                <p>京ICP备：14012449号 黔ICP证：B2-20140009号</p>
            </div>
        </div>

        <!--底部导航-->
        <div class="dib_daoh_b" id="navigation">
            <ul>
                <li><a href="index.html">
                    <div class="fup"><img src="images/web/d2-2.png"></div>
                    <p class="dh_dq">首 页</p></a></li>
                <li><a href="/shopping/sort.html">
                    <div class="fup"><img src="images/web/d1.png"></div>
                    <p>分 类</p></a></li>
                <li><a  data-href="/mine/shoppingCart.html?id=" id="GouWuChe">
                    <div class="fup" ><img src="images/web/d3.png"></div>
                    <p>购物车</p></a></li>
                <li><a href="/mine/myProduct.html">
                    <div class="fup"><img src="images/web/d4.png"></div>
                    <p>我</p></a></li>
            </ul>
        </div>
    </div>
    <!--大小限制-->
</div>
<!--搜索页面-->
<div id="shous_yem">
    <div class="toub_beij">
        <div class="zhongj_k zhongj_k_tanc">
            <div class="logo_k logo_k_fanh"><a id="sous_fanh_sy"><img class="fanh_ann" src="images/web/fanh.png"></a>
            </div>
            <div class="shous_k shous_k_ganc">
                <a href="#" class="sous_ann_k"><span class="sous_ann"></span></a>
                <input type="search" placeholder="限时疯抢，好物低至1元" placeholder_str="">
            </div>
        </div>
    </div>
    <div class="remen_sos">
        <p>热门搜索：</p>
        <ul>
            <li><a href="#">笔记本</a></li>
            <li><a href="#">游戏本</a></li>
            <li><a href="#">工作站笔记本</a></li>
            <li><a href="#">平板电脑</a></li>
            <li><a href="#">台式机</a></li>
            <li><a href="#">一体机服务器</a></li>
        </ul>
    </div>
</div>
</body>
</html>

<script type="text/javascript">
    window.onload = function () {
        onload2();

        /*
                var TheMenu=document.getElementById('zhu_caid');
                var LieBiao=document.getElementById('daoh_lb');
                var Html=document.getElementsByTagName("html")[0];//0 第一个数组
                TheMenu.onclick=function(event)
                {
                    if (LieBiao.style.display=='block')
                    {
                        LieBiao.style.display='none';
                    }
                    else {
                        LieBiao.style.display='block';
                    }
                    event.stopPropagation();//阻止冒泡事件
                }
                Html.onclick=function(){
                    LieBiao.style.display='none';
                }
            };*/

        function onload2() {
            var Sos = document.getElementById('sos_tanc');
            var ShouYe = document.getElementById('yemnr');
            var SosYe = document.getElementById('shous_yem');
            var SosFanHui = document.getElementById('sous_fanh_sy');
            Sos.onclick = function () {
                ShouYe.style.display = ('none');
                SosYe.style.display = ('block');
            }
            SosFanHui.onclick = function () {
                ShouYe.style.display = ('block');
                SosYe.style.display = ('none');
            }
        };
    };
</script>